<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app" >
    <input type="text" name="username" v-model="user.username"><br>
    <input type="password" name="password" v-model="user.password"><br>


    <a :href="url">百度一下</a><br>
    <buttonb @click="login()">按钮</buttonb>
    <div v-if="user.age<18">1</div>
    <div v-else-if="user.age>=18&&user.age<60">2</div>
    <div v-else>3</div>
    <div v-for="(addr,i) in addrs">
        {{i+1}}--{{addr}}
    </div>
</div>



<script src="js/vue.js"></script>
<script src="js/axios-0.18.0.js"></script>

<script>
    new Vue({
        el:"#app",
        data(){
            return{
                user:{
                    username:"",
                    password:"",
                    age:18,
                },
                addrs:["湖南","湖北"],
                url:"http://www.baidu.com"
            }
        },
        methods:{
            login(){
                window.alert("登陆:"+this.user)
            }
        }
    })

</script>
</body>
</html>